<template>
  <!-- 批次概览 -->
  <BaseMainSlot>
    <template v-slot:searchbox>
      <el-collapse v-model="activeName" accordion @change="handleChange">
        <el-collapse-item name="1">
          <template slot="title">
            <div class="select-btns search-btns" @click.stop="changeSelect()">
              <i class="el-icon-circle-check"></i>
              <p v-if="activeName === '1'">收起筛选</p>
              <p v-if="activeName === ''">展开筛选</p>
            </div>
          </template>
          <div class="search-btn search-btns" @click.stop="queryPageList(), searchPage()">
            <i class="el-icon-circle-check"></i>
            <p>查询</p>
          </div>
          <div class="select-box-content">
            <div class="select-box-content-name">批次编号</div>
            <el-input v-model="mnecode" clearable />
          </div>
          <div class="select-box-content">
            <div class="select-box-content-name">码单号</div>
            <el-input v-model="productionBatchCode" clearable />
          </div>
          <div class="select-box-content">
            <div class="select-box-content-name">养殖鱼塘</div>
            <el-select filterable clearable v-model="fishPondId" filterable clearable>
              <el-option v-for="(item, index) in fishPondList" :key="index" :label="item.pondName"
                :value="item.fishPondId" />
            </el-select>
          </div>
          <div class="select-box-content">
            <div class="select-box-content-name">养殖品种</div>
            <el-select filterable clearable v-model="fishVarietyId" filterable clearable>
              <el-option v-for="(item, index) in fishVarietyData" :key="index" :label="item.varietyName"
                :value="item.fishVarietyId" />
            </el-select>
          </div>
          <div class="select-box-content">
            <div class="select-box-content-name">批次状态</div>
            <el-select filterable clearable v-model="batchStatus" filterable clearable>
              <el-option label="新创建" value="CREATE" />
              <el-option label="未完成" value="UN_COMPLETE" />
              <el-option label="已完成" value="COMPLETED" />
            </el-select>
          </div>
        </el-collapse-item>
      </el-collapse>
    </template>
    <template v-slot:content>
      <div class="batchContent">
        <BatchInfo :batchInfoList="batchInfoList"></BatchInfo>
      </div>
      <Pagination :page-size="pageSize" :current-page="currentPage" :total-size="totalSize"
        @changeCurrentPage="changeCurrentPage" />
    </template>
  </BaseMainSlot>
</template>

<script>
import BaseMainSlot from "@/components/BaseMainSlot/kong-new2.vue";
import BatchInfo from "./components/batch-info";
import Pagination from "@/components/Pagination";

import BatchMangeApi from "@/api/batch-mange";
import FishVarietyApi from "@/api/basic-info-manage/fishVariety";
import FishPondApi from "@/api/basic-info-manage/fishPond";

import { mymixin } from "@/utils/mixin";

export default {
  name: "batchSummaryStatistics",
  components: { BatchInfo, BaseMainSlot, Pagination },
  mixins: [mymixin],
  data () {
    return {
      batchStatus: '',
      activeName: '',
      fishVarietyId: '',
      fishPondList: [],
      fishVarietyData: [],
      fishPondId: '',
      productionBatchCode: '',
      mnecode: '',
      batchInfoList: [],
      pageSize: 10,
      currentPage: 1
    };
  },
  computed: {
  },
  watch: {},
  created () {
  },
  mounted () {
    this.queryPageList()
    this.querySelectedList()
  },
  methods: {
    searchPage () {
      this.currentPage = 1
      this.queryPageList();
    },
    //获取查询表单的下拉列表项
    querySelectedList () {
      Promise.all([
        FishVarietyApi.queryByCondition(), //鱼类品种
        FishPondApi.queryByCondition(), //可选鱼塘
      ]).then((results) => {
        console.log("success:", results);
        this.fishVarietyData = results[0] ? results[0].data : [];
        this.fishPondList = results[1] ? results[1].data : [];
      }).catch((e) => {
        console.log("error", e);
      });
    },
    //翻页
    changeCurrentPage (currentPage) {
      this.currentPage = currentPage;
      this.queryPageList();
    },
    //获取批次
    queryPageList () {
      let params = {
        page: this.currentPage,
        size: this.pageSize,
        entity: {
        }
      };
      if (this.batchStatus) params.entity.status = this.batchStatus;
      if (this.mnecode) params.entity.mnecode = this.mnecode;
      if (this.fishPondId) params.entity.fishPondId = this.fishPondId;
      if (this.fishVarietyId) params.entity.fishVarietyId = this.fishVarietyId;
      if (this.productionBatchCode) params.entity.productionBatchCode = this.productionBatchCode;
      BatchMangeApi.queryPageByCondition(params).then(res => {
        if (res.success === true) {
          this.batchInfoList = res.data.content || [];
          this.totalSize = res.data.totalElements;
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.batchContent {
  height: calc(100% - 50px);
  overflow: hidden;
}
</style>
